<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="main::head">
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="container-fluid">
    <div class="row justify-content-end">
        <a class="col-2 btn-secondary btn ">交卷</a>
    </div>
    <form class="row g-3" th:each="paperQuestion:${pageBean.arrayList}" th:object="${paperQuestion}" method="post">
        <div class="row g-3">
            <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
                <div class="btn-group" role="group" aria-label="First group" >
                    <th:block th:each="index:${#numbers.sequence(1,pageBean.totalPage)}">
                    <button class="btn btn-outline-secondary" th:text="${index}" th:onclick="'form.action=\'/do-paper/'+${index}+'\';form.submit();'">1
                    </button>
<!--                        <script th:inline="javascript">-->
<!--                        function jump[(${index})](){-->
<!--                            form.action='do-pape/[(${index})]/aaa';-->
<!--                            form.submit();-->
<!--                            return false;-->
<!--                        }-->
                    </script>
                    </th:block>
                    <!--/*-->
                    <button type="button" class="btn btn-outline-secondary">2</button>
                    <button type="button" class="btn btn-outline-secondary">3</button>
                    <button type="button" class="btn btn-outline-secondary">4</button>
                    <button type="button" class="btn btn-outline-secondary">1</button>
                    <button type="button" class="btn btn-outline-secondary">2</button>
                    <button type="button" class="btn btn-outline-secondary">3</button>
                    <button type="button" class="btn btn-outline-secondary">4</button>
                    <!--*/-->
                </div>

            </div>
        </div>
        <input type="hidden" th:value="*{id_question}" name="id_paper_question">
        <p><span th:text="*{question_order}">1</span>. <span th:text="*{question.question_face}">
            《建议》从九个方面勾画了2035年基本实现社会主义现代化远景目标，其中提到基本实现（ ），建成现代化经济体系。
        </span></p>
        <div th:if="${paperQuestion.question.type eq '1' ||paperQuestion.question.type eq '3'}">
            <div class="form-check" th:each="s:*{question.selections}">
                <input class="form-check-input" type="checkbox" th:value="${s.the_selection}" value="A"
                       name="student_answer" id="flexCheckDefault">
                <label class="form-check-label" for="flexCheckDefault">
                    <span th:text="${s.the_selection}">A</span><span th:text="${s.the_content}"></span>
                </label>
            </div>
            <!--/*-->
            <div class="form-check">
                <input class="form-check-input" type="checkbox" value="">
                <label class="form-check-label" for="flexCheckDefault">
                    B
                </label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" value="">
                <label class="form-check-label" for="flexCheckDefault">
                    C
                </label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" value="">
                <label class="form-check-label" for="flexCheckDefault">
                    D
                </label>
            </div>
            <!--*/-->
        </div>

        <div th:if="${paperQuestion.question.type} eq '2'">
            <div class="form-check" th:each="s:*{question.selections}">
                <input class="form-check-input" type="checkbox" th:value="${s.the_selection}" value="A"
                       name="student_answer" id="flexCheckDefault0">
                <label class="form-check-label" for="flexCheckDefault0">
                    <span th:text="${s.the_selection}">A</span><span th:text="${s.the_content}"></span>
                </label>
            </div>
        </div>
        <!--/*-->
        <div class="form-check">
            <input class="form-check-input" type="radio" name="flexRadioDefault">
            <label class="form-check-label" for="flexRadioDefault1">
                B
            </label>
        </div>
        <div class="form-check">
            <input class="form-check-input" type="radio" name="flexRadioDefault">
            <label class="form-check-label" for="flexRadioDefault1">
                C
            </label>
        </div>
        <div class="form-check">
            <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
            <label class="form-check-label" for="flexRadioDefault1">
                D
            </label>
        </div>
        <!--*/-->
        <div class="col-12" th:if="${paperQuestion.question.type eq '4' || paperQuestion.question.type eq '5'}">
            <textarea class="form-control" rows="5"></textarea>
        </div>
        <nav>
            <ul class="pagination justify-content-end">
                <li class="page-item disabled" th:class="${pageBean.current == 1}?'page-item disabled':'page-item'">
                    <button class="page-link" href="#" aria-disabled="true"
                            onclick="lastQ(form)">上一题
                        <script th:inline="javascript">
                            function lastQ(form) {
                                form.action = '/do-paper/[(${pageBean.current}-1)]';
                                form.submit();
                                return false;
                            }
                        </script>
                    </button>
                </li>
                <li class="page-item" th:class="${pageBean.current == pageBean.totalPage}?'page-item disabled':'page-item'">
                    <button class="page-link" href="#" onclick="nextQ(form)">下一题
                        <script th:inline="javascript">
                            function nextQ(form) {
                                form.action = '/do-paper/[(${pageBean.current}+1)]';
                                form.submit();
                                return false;
                            }
                        </script>
                    </button>

                </li>
            </ul>
        </nav>
    </form>
</div>

</body>
</html>